/* 
 * 内容模块缩略图样式覆盖
 * 使缩略图四个角为圆角
 */

/* 修改缩略图容器样式 */
.article-image {
    width: 112px;
    height: 112px;
    flex-shrink: 0;
    overflow: hidden;
    border-radius: 12px;  /* 将图片容器改为圆角矩形 */
    position: relative;  /* 添加相对定位 */
    background-color: #f5f5f5;  /* 添加背景色 */
}

/* 修改缩略图样式 */
.thumbnail {
    width: 100%;
    height: 100%;
    object-fit: cover;  /* 确保图片填满整个容器 */
    border-radius: 12px;  /* 确保图片本身也是圆角 */
    position: absolute;  /* 使用绝对定位 */
    top: 50%;  /* 居中定位 */
    left: 50%;  /* 居中定位 */
    transform: translate(-50%, -50%) scale(3);  /* 居中并放大图片 */
    display: block;  /* 确保块级显示 */
}

/* 移除鼠标悬停时的放大效果 */
.article-card:hover .thumbnail {
    transform: translate(-50%, -50%) scale(3);  /* 保持放大状态 */
}